<!DOCTYPE html>
<html lang="en">

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport"
        content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
    <title>属性</title>
    <link rel="stylesheet" href="../layui/css/layui.css">
    <style>
        body {
            max-height: 600px;
        }

        body::-webkit-scrollbar {
            /*滚动条整体样式*/
            width: 8px;
            /*高宽分别对应横竖滚动条的尺寸*/
            height: 8px;
            scrollbar-arrow-color: red;
        }

        body::-webkit-scrollbar-thumb {
            border-radius: 5px;
            -webkit-box-shadow: inset 0 0 5px rgba(218, 218, 218, 0.2);
            box-shadow: inset 0 0 5px rgba(218, 218, 218, 0.2);
            background: rgba(218, 218, 218, 0.5);
            scrollbar-arrow-color: red;
        }

        body::-webkit-scrollbar-track {
            -webkit-box-shadow: inset 0 0 5px rgba(218, 218, 218, 0.2);
            box-shadow: inset 0 0 5px rgba(218, 218, 218, 0.2);
            border-radius: 0;
            background: rgba(218, 218, 218, 0.1);
        }

        html,
        body,
        #Attribute {
            background-color: rgba(0, 0, 0, 0);
            color: #fff;
        }

        .layui-form-item {
            border: 1px #fff solid;
            margin-bottom: 0px !important;
            border-bottom: none;
        }

        .layui-input {
            background-color: #fff !important;
            height: 30px;
            margin-top: 5px
        }

        .active {
            border: 1px solid #fc0 !important;
            box-shadow: 0 0 8px #ddd;
            -moz-box-shadow: 0 0 8px #ddd;
            -webkit-box-shadow: 0 0 8px #ddd;
            cursor: pointer;
        }


        .layui-form-label {
            width: 100px !important;
            padding: 11px 15px !important;
            border-right: 1px #fff solid;
            font-weight: bold !important;
            font-size: 14px;
            text-align: center;
        }

        .layui-input-block {
            width: 150px !important;
            margin-left: 150px !important;
        }

        .mCSB_container {
            margin-right: 17px !important;
        }

        legend {
            text-align: center;
            font-size: 16px;
            font-weight: bold;
            margin-bottom: 15px;
            margin-top: 20px;
        }

        .removeGraphic {
            position: absolute;
            top: -9px;
            right: 0;
        }

        .attrTitle {
            position: relative;
        }

        .topRadius {
            display: none;
        }

        .color {
            height: 42px;
        }

        .layui-form-selected dl {
            color: #000 !important;
        }
    </style>
</head>

<body>
    <div id="Attribute" style="margin: 10px;">
        <div class="attrTitle">
            <legend>样式信息</legend>
            <!-- <button type="button" class="layui-btn layui-btn-danger removeGraphic" onclick="removeGraphic()">移除</button> -->
        </div>
        <!--基本点-->
        <div class="props point" style="display: none">
            <form class="layui-form" action="">
                <div class="layui-form-item">
                    <label class="layui-form-label">大小</label>
                    <div class="layui-input-block">
                        <input type="number" name="size" lay-verify="title" autocomplete="off" placeholder="0"
                            onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">是否不被遮挡</label>
                    <div class="layui-input-block">
                        <input type="checkbox" lay-skin="switch" id="isPointDisableDepthTest"
                            lay-filter="isPointDisableDepthTest" title="开关">
                    </div>
                </div>
                <div class="layui-form-item color">
                    <label class="layui-form-label">填充色</label>
                    <div class="layui-input-block">
                        <div id="colorchk-point-fill" style="display: inline-block;margin-top: 2px;"></div>
                    </div>
                </div>
                <div class="layui-form-item" style="position:relative;">
                    <label class="layui-form-label">填充透明度</label>
                    <div class="layui-input-block" style="position: absolute;top: 16px">
                        <div id="opacity-point-fill" class="demo-slider"></div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">是否显示边框</label>
                    <div class="layui-input-block">
                        <input type="checkbox" lay-skin="switch" id="showPointOutline" lay-filter="showPointOutline"
                            title="开关">
                    </div>
                </div>
                <div class="layui-form-item outline">
                    <label class="layui-form-label">边框大小</label>
                    <div class="layui-input-block">
                        <input type="number" name="outlineWidth" lay-verify="title" autocomplete="off" placeholder="0"
                            onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input" id="isBanBorder_basicPoint"
                            readonly>
                    </div>
                </div>
                <div class="layui-form-item outline color">
                    <label class="layui-form-label">边框色</label>
                    <div class="layui-input-block">
                        <div id="colorchk-point-outline" style="display: inline-block;margin-top: 2px;"></div>
                    </div>
                </div>
                <div class="layui-form-item outline" style="position:relative;">
                    <label class="layui-form-label">边框透明度</label>
                    <div class="layui-input-block" style="position: absolute;top: 16px">
                        <div id="opacity-point-outline" class="demo-slider"></div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">最小可视距离</label>
                    <div class="layui-input-block">
                        <input type="number" name="minViewDistance" lay-verify="title" autocomplete="off"
                            placeholder="0" onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item" style="border: 1px #fff solid">
                    <label class="layui-form-label">最大可视距离</label>
                    <div class="layui-input-block">
                        <input type="number" name="maxViewDistance" lay-verify="title" autocomplete="off"
                            placeholder="0" onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input">
                    </div>
                </div>
            </form>
        </div>
        <!--图片点-->
        <div class="props billboard" style="display: none">
            <form class="layui-form" action="">
                <div class="layui-form-item">
                    <label class="layui-form-label">图片链接</label>
                    <div class="layui-input-block">
                        <input type="text" name="image" lay-verify="title" autocomplete="off" placeholder="0"
                            class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">比例大小</label>
                    <div class="layui-input-block">
                        <input type="number" name="scale" lay-verify="title" autocomplete="off" placeholder="0"
                            onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">水平对齐</label>
                    <div class="layui-input-block">
                        <select name="horizontalOrigin" class="horizontalOrigin" lay-filter="horizontalOrigin">
                            <option value="0">居中</option>
                            <option value="-1">左对齐</option>
                            <option value="1">右对齐</option>
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">垂直对齐</label>
                    <div class="layui-input-block">
                        <select name="verticalOrigin" class="verticalOrigin" lay-filter="verticalOrigin">
                            <option value="0">居中</option>
                            <option value="-1">上对齐</option>
                            <option value="1">下对齐</option>
                            <option value="2">基线对齐</option>
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">旋转角度</label>
                    <div class="layui-input-block">
                        <input type="number" name="rotation" lay-verify="title" autocomplete="off" placeholder="0"
                            onkeyup="value=value.replace(/[^\d\.\-]/g,'')" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">宽</label>
                    <div class="layui-input-block">
                        <input type="number" name="width" lay-verify="title" autocomplete="off" placeholder="0"
                            onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">高</label>
                    <div class="layui-input-block">
                        <input type="number" name="height" lay-verify="title" autocomplete="off" placeholder="0"
                            onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">是否不被遮挡</label>
                    <div class="layui-input-block">
                        <input type="checkbox" lay-skin="switch" id="isBillboardDisableDepthTest"
                            lay-filter="isBillboardDisableDepthTest" title="开关">
                    </div>
                </div>
                <div class="layui-form-item color">
                    <label class="layui-form-label">填充色</label>
                    <div class="layui-input-block">
                        <div id="colorchk-billboard-fill" style="display: inline-block;margin-top: 2px;"></div>
                    </div>
                </div>
                <div class="layui-form-item" style="position:relative;">
                    <label class="layui-form-label">填充透明度</label>
                    <div class="layui-input-block" style="position: absolute;top: 16px">
                        <div id="opacity-billboard-fill" class="demo-slider"></div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">最小可视距离</label>
                    <div class="layui-input-block">
                        <input type="number" name="minViewDistance" lay-verify="title" autocomplete="off"
                            placeholder="0" onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item" style="border: 1px #fff solid">
                    <label class="layui-form-label">最大可视距离</label>
                    <div class="layui-input-block">
                        <input type="number" name="maxViewDistance" lay-verify="title" autocomplete="off"
                            placeholder="0" onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input">
                    </div>
                </div>
            </form>
        </div>
        <!--文本点-->
        <div class="props label" style="display: none">
            <form class="layui-form" action="">
                <div class="layui-form-item">
                    <label class="layui-form-label">内容</label>
                    <div class="layui-input-block">
                        <input type="text" name="text" lay-verify="title" autocomplete="off" placeholder="0"
                            class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item" style="display: none;">
                    <label class="layui-form-label">字体</label>
                    <div class="layui-input-block">
                        <input type="text" name="font" lay-verify="title" autocomplete="off" placeholder="0"
                            class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">字体大小</label>
                    <div class="layui-input-block">
                        <input type="number" name="fontsize"  lay-verify="number"  autocomplete="off" placeholder="0" value="24"
                        class="layui-input">
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">字体</label>
                    <div class="layui-input-block">
                        <select name="typeface" id="typeface" class="typeface" lay-filter="typeface">
                            <option value="宋体">宋体</option>
                            <option value="Sans-serif">Sans-serif</option>
                            <option value="Serif">Serif</option>
                            <option value="Monospace">Monospace</option>
                            <option value="Cursive">Cursive</option>
                            <option value="Fantasy">Fantasy</option>
                            <option value="SimHei">SimHei</option>
                            <option value="Microsoft YaHei">Microsoft YaHei</option>
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">水平对齐</label>
                    <div class="layui-input-block">
                        <select name="horizontalOrigin" class="horizontalOrigin" lay-filter="horizontalOrigin">
                            <option value="0">居中</option>
                            <option value="-1">左对齐</option>
                            <option value="1">右对齐</option>
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">垂直对齐</label>
                    <div class="layui-input-block">
                        <select name="verticalOrigin" class="verticalOrigin" lay-filter="verticalOrigin">
                            <option value="0">居中</option>
                            <option value="-1">上对齐</option>
                            <option value="1">下对齐</option>
                            <option value="2">基线对齐</option>
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">比例大小</label>
                    <div class="layui-input-block">
                        <input type="number" name="scale" lay-verify="title" autocomplete="off" placeholder="0"
                            onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">是否不被遮挡</label>
                    <div class="layui-input-block">
                        <input type="checkbox" lay-skin="switch" id="isLabelDisableDepthTest"
                            lay-filter="isLabelDisableDepthTest" title="开关">
                    </div>
                </div>
                <div class="layui-form-item color">
                    <label class="layui-form-label">字体颜色</label>
                    <div class="layui-input-block">
                        <div id="colorchk-label-fill" style="display: inline-block;margin-top: 2px;"></div>
                    </div>
                </div>
                <div class="layui-form-item" style="position:relative;">
                    <label class="layui-form-label">填充透明度</label>
                    <div class="layui-input-block" style="position: absolute;top: 16px">
                        <div id="opacity-label-fill" class="demo-slider"></div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">是否显示边框</label>
                    <div class="layui-input-block">
                        <input type="checkbox" lay-skin="switch" id="showLabelOutline" lay-filter="showLabelOutline"
                            title="开关">
                    </div>
                </div>
                <div class="layui-form-item outline">
                    <label class="layui-form-label">边框大小</label>
                    <div class="layui-input-block">
                        <input type="number" name="outlineWidth" lay-verify="title" autocomplete="off" placeholder="0"
                            onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input"
                            id="isBanBorder_labelOurline" readonly>
                    </div>
                </div>
                <div class="layui-form-item outline color">
                    <label class="layui-form-label">边框色</label>
                    <div class="layui-input-block">
                        <div id="colorchk-label-outline" style="display: inline-block;margin-top: 2px;"></div>
                    </div>
                </div>
                <div class="layui-form-item outline" style="position:relative;">
                    <label class="layui-form-label">边框透明度</label>
                    <div class="layui-input-block" style="position: absolute;top: 16px">
                        <div id="opacity-label-outline" class="demo-slider"></div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">是否显示背景</label>
                    <div class="layui-input-block">
                        <input type="checkbox" lay-skin="switch" id="showLabelBackground"
                            lay-filter="showLabelBackground" title="开关">
                    </div>
                </div>
                <div class="layui-form-item background color">
                    <label class="layui-form-label">背景色</label>
                    <div class="layui-input-block">
                        <div id="colorchk-label-background" style="display: inline-block;margin-top: 2px;"></div>
                    </div>
                </div>
                <div class="layui-form-item background" style="position:relative;">
                    <label class="layui-form-label">背景透明度</label>
                    <div class="layui-input-block" style="position: absolute;top: 16px">
                        <div id="opacity-label-background" class="demo-slider"></div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">最小可视距离</label>
                    <div class="layui-input-block">
                        <input type="number" name="minViewDistance" lay-verify="title" autocomplete="off"
                            placeholder="0" onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item" style="border: 1px #fff solid">
                    <label class="layui-form-label">最大可视距离</label>
                    <div class="layui-input-block">
                        <input type="number" name="maxViewDistance" lay-verify="title" autocomplete="off"
                            placeholder="0" onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input">
                    </div>
                </div>
            </form>
        </div>
        <!--模型点-->
        <div class="props model" style="display: none">
            <form class="layui-form" action="">
                <div class="layui-form-item">
                    <label class="layui-form-label">模型链接</label>
                    <div class="layui-input-block">
                        <input type="text" name="url" lay-verify="title" autocomplete="off" placeholder="0"
                            class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">高度</label>
                    <div class="layui-input-block">
                        <input type="number" name="height" lay-verify="title" autocomplete="off" placeholder="0"
                            onkeyup="value=value.replace(/[^\d\.\-]/g,'')" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">比例大小</label>
                    <div class="layui-input-block">
                        <input type="number" name="scale" lay-verify="title" autocomplete="off" placeholder="0"
                            onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">最小显示尺寸</label>
                    <div class="layui-input-block">
                        <input type="number" name="minimumPixelSize" lay-verify="title" autocomplete="off"
                            placeholder="0" onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">是否执行动画</label>
                    <div class="layui-input-block">
                        <input type="checkbox" lay-skin="switch" id="runAnimations" lay-filter="runAnimations"
                            title="开关">
                    </div>
                </div>
                <div class="layui-form-item color">
                    <label class="layui-form-label">填充色</label>
                    <div class="layui-input-block">
                        <div id="colorchk-model-fill" style="display: inline-block;margin-top: 2px;"></div>
                    </div>
                </div>
                <div class="layui-form-item" style="position:relative;">
                    <label class="layui-form-label">填充透明度</label>
                    <div class="layui-input-block" style="position: absolute;top: 16px">
                        <div id="opacity-model-fill" class="demo-slider"></div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">自旋转</label>
                    <div class="layui-input-block">
                        <input type="checkbox" lay-skin="switch" id="autoRotate" lay-filter="autoRotate" title="开关">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">方向角</label>
                    <div class="layui-input-block">
                        <input type="number" name="heading" lay-verify="title" autocomplete="off" placeholder="0"
                            onkeyup="value=value.replace(/[^\d\.\-]/g,'')" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">俯仰角</label>
                    <div class="layui-input-block">
                        <input type="number" name="pitch" lay-verify="title" autocomplete="off" placeholder="0"
                            onkeyup="value=value.replace(/[^\d\.\-]/g,'')" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">翻滚角</label>
                    <div class="layui-input-block">
                        <input type="number" name="roll" lay-verify="title" autocomplete="off" placeholder="0"
                            onkeyup="value=value.replace(/[^\d\.\-]/g,'')" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">最小可视距离</label>
                    <div class="layui-input-block">
                        <input type="number" name="minViewDistance" lay-verify="title" autocomplete="off"
                            placeholder="0" onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item" style="border: 1px #fff solid">
                    <label class="layui-form-label">最大可视距离</label>
                    <div class="layui-input-block">
                        <input type="number" name="maxViewDistance" lay-verify="title" autocomplete="off"
                            placeholder="0" onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input">
                    </div>
                </div>
            </form>
        </div>
        <!--线-->
        <div class="props polyline" style="display: none">
            <form class="layui-form" action="">
                <div class="layui-form-item">
                    <label class="layui-form-label">线宽</label>
                    <div class="layui-input-block">
                        <input type="number" name="width" lay-verify="title" autocomplete="off" placeholder="0"
                            onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">是否贴地</label>
                    <div class="layui-input-block">
                        <input type="checkbox" lay-skin="switch" id="showClampToGround_Polyline"
                            lay-filter="showClampToGround" title="开关">
                    </div>
                </div>
                <div class="layui-form-item color">
                    <label class="layui-form-label">填充色</label>
                    <div class="layui-input-block">
                        <div id="colorchk-polyline-fill" style="display: inline-block;margin-top: 2px;"></div>
                    </div>
                </div>
                <div class="layui-form-item" style="position:relative;">
                    <label class="layui-form-label">填充透明度</label>
                    <div class="layui-input-block" style="position: absolute;top: 16px">
                        <div id="opacity-polyline-fill" class="demo-slider"></div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">是否显示边框</label>
                    <div class="layui-input-block">
                        <input type="checkbox" lay-skin="switch" id="showPolylineOutline"
                            lay-filter="showPolylineOutline" title="开关">
                    </div>
                </div>
                <div class="layui-form-item outline">
                    <label class="layui-form-label">边框大小</label>
                    <div class="layui-input-block">
                        <input type="number" name="outlineWidth" lay-verify="title" autocomplete="off" placeholder="0"
                            onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input" id="isBanBorder" readonly>
                    </div>
                </div>
                <div class="layui-form-item outline color">
                    <label class="layui-form-label">边框色</label>
                    <div class="layui-input-block">
                        <div id="colorchk-polyline-outline" style="display: inline-block;margin-top: 2px;"></div>
                    </div>
                </div>
                <div class="layui-form-item outline" style="position:relative;">
                    <label class="layui-form-label">边框透明度</label>
                    <div class="layui-input-block" style="position: absolute;top: 16px">
                        <div id="opacity-polyline-outline" class="demo-slider"></div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">最小可视距离</label>
                    <div class="layui-input-block">
                        <input type="number" name="minViewDistance" lay-verify="title" autocomplete="off"
                            placeholder="0" onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item" style="border: 1px #fff solid">
                    <label class="layui-form-label">最大可视距离</label>
                    <div class="layui-input-block">
                        <input type="number" name="maxViewDistance" lay-verify="title" autocomplete="off"
                            placeholder="0" onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input">
                    </div>
                </div>
            </form>
        </div>
        <!--多边形-->
        <div class="props polygon" style="display: none">
            <form class="layui-form" action="">
                <div class="layui-form-item">
                    <label class="layui-form-label">是否贴地</label>
                    <div class="layui-input-block">
                        <input type="checkbox" lay-skin="switch" id="showClampToGround_Polygon"
                            lay-filter="showClampToGround" title="开关">
                    </div>
                </div>
                <div class="layui-form-item color">
                    <label class="layui-form-label">填充色</label>
                    <div class="layui-input-block">
                        <div id="colorchk-polygon-fill" style="display: inline-block;margin-top: 2px;"></div>
                    </div>
                </div>
                <div class="layui-form-item" style="position:relative">
                    <label class="layui-form-label">填充透明度</label>
                    <div class="layui-input-block" style="position: absolute;top: 16px">
                        <div id="opacity-polygon-fill" class="demo-slider"></div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">是否显示边框</label>
                    <div class="layui-input-block">
                        <input type="checkbox" lay-skin="switch" id="showPolygonOutline" lay-filter="showPolygonOutline"
                            title="开关">
                    </div>
                </div>
                <div class="layui-form-item outline color">
                    <label class="layui-form-label">边框色</label>
                    <div class="layui-input-block">
                        <div id="colorchk-polygon-outline" style="display: inline-block;margin-top: 2px;"></div>
                    </div>
                </div>
                <div class="layui-form-item outline" style="position:relative;">
                    <label class="layui-form-label">边框透明度</label>
                    <div class="layui-input-block" style="position: absolute;top: 16px">
                        <div id="opacity-polygon-outline" class="demo-slider"></div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">最小可视距离</label>
                    <div class="layui-input-block">
                        <input type="number" name="minViewDistance" lay-verify="title" autocomplete="off"
                            placeholder="0" onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item" style="border: 1px #fff solid">
                    <label class="layui-form-label">最大可视距离</label>
                    <div class="layui-input-block">
                        <input type="number" name="maxViewDistance" lay-verify="title" autocomplete="off"
                            placeholder="0" onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input">
                    </div>
                </div>
            </form>
        </div>
        <!--矩形-->
        <div class="props rectangle" style="display: none">
            <form class="layui-form" action="">
                <div class="layui-form-item">
                    <label class="layui-form-label">是否贴地</label>
                    <div class="layui-input-block">
                        <input type="checkbox" lay-skin="switch" id="showClampToGround_Rectangle"
                            lay-filter="showClampToGround" title="开关">
                    </div>
                </div>
                <div class="layui-form-item height">
                    <label class="layui-form-label">高度</label>
                    <div class="layui-input-block">
                        <input type="number" name="height" lay-verify="title" autocomplete="off" placeholder="0"
                            onkeyup="value=value.replace(/[^\d\.\-]/g,'')" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">旋转角度</label>
                    <div class="layui-input-block">
                        <input type="number" name="rotation" lay-verify="title" autocomplete="off" placeholder="0"
                            onkeyup="value=value.replace(/[^\d\.\-]/g,'')" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item color">
                    <label class="layui-form-label">填充色</label>
                    <div class="layui-input-block">
                        <div id="colorchk-rectangle-fill" style="display: inline-block;margin-top: 2px;"></div>
                    </div>
                </div>
                <div class="layui-form-item" style="position:relative">
                    <label class="layui-form-label">填充透明度</label>
                    <div class="layui-input-block" style="position: absolute;top: 16px">
                        <div id="opacity-rectangle-fill" class="demo-slider"></div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">是否显示边框</label>
                    <div class="layui-input-block">
                        <input type="checkbox" lay-skin="switch" id="showRectangleOutline"
                            lay-filter="showRectangleOutline" title="开关">
                    </div>
                </div>
                <div class="layui-form-item outline color">
                    <label class="layui-form-label">边框色</label>
                    <div class="layui-input-block">
                        <div id="colorchk-rectangle-outline" style="display: inline-block;margin-top: 2px;"></div>
                    </div>
                </div>
                <div class="layui-form-item outline" style="position:relative;">
                    <label class="layui-form-label">边框透明度</label>
                    <div class="layui-input-block" style="position: absolute;top: 16px">
                        <div id="opacity-rectangle-outline" class="demo-slider"></div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">最小可视距离</label>
                    <div class="layui-input-block">
                        <input type="number" name="minViewDistance" lay-verify="title" autocomplete="off"
                            placeholder="0" onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item" style="border: 1px #fff solid">
                    <label class="layui-form-label">最大可视距离</label>
                    <div class="layui-input-block">
                        <input type="number" name="maxViewDistance" lay-verify="title" autocomplete="off"
                            placeholder="0" onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input">
                    </div>
                </div>
            </form>
        </div>
        <!--圆形-->
        <div class="props ellipse" style="display: none">
            <form class="layui-form" action="">
                <div class="layui-form-item">
                    <label class="layui-form-label">是否贴地</label>
                    <div class="layui-input-block">
                        <input type="checkbox" lay-skin="switch" id="showClampToGround_Ellipse"
                            lay-filter="showClampToGround" title="开关">
                    </div>
                </div>
                <div class="layui-form-item height">
                    <label class="layui-form-label">高度</label>
                    <div class="layui-input-block">
                        <input type="number" name="height" lay-verify="title" autocomplete="off" placeholder="0"
                            onkeyup="value=value.replace(/[^\d\.\-]/g,'')" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">半径</label>
                    <div class="layui-input-block">
                        <input type="number" name="radius" lay-verify="title" autocomplete="off" placeholder="0"
                            onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item color">
                    <label class="layui-form-label">填充色</label>
                    <div class="layui-input-block">
                        <div id="colorchk-ellipse-fill" style="display: inline-block;margin-top: 2px;"></div>
                    </div>
                </div>
                <div class="layui-form-item" style="position:relative">
                    <label class="layui-form-label">填充透明度</label>
                    <div class="layui-input-block" style="position: absolute;top: 16px">
                        <div id="opacity-ellipse-fill" class="demo-slider"></div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">是否显示边框</label>
                    <div class="layui-input-block">
                        <input type="checkbox" lay-skin="switch" id="showEllipseOutline" lay-filter="showEllipseOutline"
                            title="开关">
                    </div>
                </div>
                <div class="layui-form-item outline color">
                    <label class="layui-form-label">边框色</label>
                    <div class="layui-input-block">
                        <div id="colorchk-ellipse-outline" style="display: inline-block;margin-top: 2px;"></div>
                    </div>
                </div>
                <div class="layui-form-item outline" style="position:relative;">
                    <label class="layui-form-label">边框透明度</label>
                    <div class="layui-input-block" style="position: absolute;top: 16px">
                        <div id="opacity-ellipse-outline" class="demo-slider"></div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">最小可视距离</label>
                    <div class="layui-input-block">
                        <input type="number" name="minViewDistance" lay-verify="title" autocomplete="off"
                            placeholder="0" onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item" style="border: 1px #fff solid">
                    <label class="layui-form-label">最大可视距离</label>
                    <div class="layui-input-block">
                        <input type="number" name="maxViewDistance" lay-verify="title" autocomplete="off"
                            placeholder="0" onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input">
                    </div>
                </div>
            </form>
        </div>
        <!--多边体-->
        <div class="props ExtrudedPolygon" style="display: none">
            <form class="layui-form" action="">
                <div class="layui-form-item">
                    <label class="layui-form-label">高度</label>
                    <div class="layui-input-block">
                        <input type="number" name="height" lay-verify="title" autocomplete="off" placeholder="0"
                            onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">拉伸高度</label>
                    <div class="layui-input-block">
                        <input type="number" name="extrudedHeight" lay-verify="title" autocomplete="off" placeholder="0"
                            onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item color">
                    <label class="layui-form-label">填充色</label>
                    <div class="layui-input-block">
                        <div id="colorchk-ExtrudedPolygon-fill" style="display: inline-block;margin-top: 2px;"></div>
                    </div>
                </div>
                <div class="layui-form-item" style="position:relative">
                    <label class="layui-form-label">填充透明度</label>
                    <div class="layui-input-block" style="position: absolute;top: 16px">
                        <div id="opacity-ExtrudedPolygon-fill" class="demo-slider"></div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">是否显示边框</label>
                    <div class="layui-input-block">
                        <input type="checkbox" lay-skin="switch" id="showExtrudedPolygonOutline"
                            lay-filter="showExtrudedPolygonOutline" title="开关">
                    </div>
                </div>
                <div class="layui-form-item outline color">
                    <label class="layui-form-label">边框色</label>
                    <div class="layui-input-block">
                        <div id="colorchk-ExtrudedPolygon-outline" style="display: inline-block;margin-top: 2px;"></div>
                    </div>
                </div>
                <div class="layui-form-item outline" style="position:relative;">
                    <label class="layui-form-label">边框透明度</label>
                    <div class="layui-input-block" style="position: absolute;top: 16px">
                        <div id="opacity-ExtrudedPolygon-outline" class="demo-slider"></div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">最小可视距离</label>
                    <div class="layui-input-block">
                        <input type="number" name="minViewDistance" lay-verify="title" autocomplete="off"
                            placeholder="0" onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item" style="border: 1px #fff solid">
                    <label class="layui-form-label">最大可视距离</label>
                    <div class="layui-input-block">
                        <input type="number" name="maxViewDistance" lay-verify="title" autocomplete="off"
                            placeholder="0" onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input">
                    </div>
                </div>
            </form>
        </div>
        <!--立方体-->
        <div class="props box" style="display: none">
            <form class="layui-form" action="">
                <div class="layui-form-item">
                    <label class="layui-form-label">长</label>
                    <div class="layui-input-block">
                        <input type="number" name="long" lay-verify="title" autocomplete="off" placeholder="0"
                            onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">宽</label>
                    <div class="layui-input-block">
                        <input type="number" name="width" lay-verify="title" autocomplete="off" placeholder="0"
                            onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">高</label>
                    <div class="layui-input-block">
                        <input type="number" name="height" lay-verify="title" autocomplete="off" placeholder="0"
                            onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item color">
                    <label class="layui-form-label">填充色</label>
                    <div class="layui-input-block">
                        <div id="colorchk-box-fill" style="display: inline-block;margin-top: 2px;"></div>
                    </div>
                </div>
                <div class="layui-form-item" style="position:relative">
                    <label class="layui-form-label">填充透明度</label>
                    <div class="layui-input-block" style="position: absolute;top: 16px">
                        <div id="opacity-box-fill" class="demo-slider"></div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">是否显示边框</label>
                    <div class="layui-input-block">
                        <input type="checkbox" lay-skin="switch" id="showBoxOutline" lay-filter="showBoxOutline"
                            title="开关">
                    </div>
                </div>
                <div class="layui-form-item outline color">
                    <label class="layui-form-label">边框色</label>
                    <div class="layui-input-block">
                        <div id="colorchk-box-outline" style="display: inline-block;margin-top: 2px;"></div>
                    </div>
                </div>
                <div class="layui-form-item outline" style="position:relative;">
                    <label class="layui-form-label">边框透明度</label>
                    <div class="layui-input-block" style="position: absolute;top: 16px">
                        <div id="opacity-box-outline" class="demo-slider"></div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">最小可视距离</label>
                    <div class="layui-input-block">
                        <input type="number" name="minViewDistance" lay-verify="title" autocomplete="off"
                            placeholder="0" onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item" style="border: 1px #fff solid">
                    <label class="layui-form-label">最大可视距离</label>
                    <div class="layui-input-block">
                        <input type="number" name="maxViewDistance" lay-verify="title" autocomplete="off"
                            placeholder="0" onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input">
                    </div>
                </div>
            </form>
        </div>
        <!--圆柱/锥体-->
        <div class="props cylinder" style="display: none">
            <form class="layui-form" action="">
                <div class="layui-form-item">
                    <label class="layui-form-label">半径</label>
                    <div class="layui-input-block">
                        <input type="number" name="radius" lay-verify="title" autocomplete="off" placeholder="0"
                            onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item topRadius">
                    <label class="layui-form-label">顶部半径</label>
                    <div class="layui-input-block">
                        <input type="number" name="topRadius" lay-verify="title" autocomplete="off" placeholder="0"
                            onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">高</label>
                    <div class="layui-input-block">
                        <input type="number" name="height" lay-verify="title" autocomplete="off" placeholder="0"
                            onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item color">
                    <label class="layui-form-label">填充色</label>
                    <div class="layui-input-block">
                        <div id="colorchk-cylinder-fill" style="display: inline-block;margin-top: 2px;"></div>
                    </div>
                </div>
                <div class="layui-form-item" style="position:relative">
                    <label class="layui-form-label">填充透明度</label>
                    <div class="layui-input-block" style="position: absolute;top: 16px">
                        <div id="opacity-cylinder-fill" class="demo-slider"></div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">是否显示边框</label>
                    <div class="layui-input-block">
                        <input type="checkbox" lay-skin="switch" id="showCylinderOutline"
                            lay-filter="showCylinderOutline" title="开关">
                    </div>
                </div>
                <div class="layui-form-item outline color">
                    <label class="layui-form-label">边框色</label>
                    <div class="layui-input-block">
                        <div id="colorchk-cylinder-outline" style="display: inline-block;margin-top: 2px;"></div>
                    </div>
                </div>
                <div class="layui-form-item outline" style="position:relative;">
                    <label class="layui-form-label">边框透明度</label>
                    <div class="layui-input-block" style="position: absolute;top: 16px">
                        <div id="opacity-cylinder-outline" class="demo-slider"></div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">最小可视距离</label>
                    <div class="layui-input-block">
                        <input type="number" name="minViewDistance" lay-verify="title" autocomplete="off"
                            placeholder="0" onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item" style="border: 1px #fff solid">
                    <label class="layui-form-label">最大可视距离</label>
                    <div class="layui-input-block">
                        <input type="number" name="maxViewDistance" lay-verify="title" autocomplete="off"
                            placeholder="0" onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input">
                    </div>
                </div>
            </form>
        </div>
        <!--球体-->
        <div class="props ellipsoid" style="display: none">
            <form class="layui-form" action="">
                <div class="layui-form-item">
                    <label class="layui-form-label">半径</label>
                    <div class="layui-input-block">
                        <input type="number" name="radius" lay-verify="title" autocomplete="off" placeholder="0"
                            onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item color">
                    <label class="layui-form-label">填充色</label>
                    <div class="layui-input-block">
                        <div id="colorchk-ellipsoid-fill" style="display: inline-block;margin-top: 2px;"></div>
                    </div>
                </div>
                <div class="layui-form-item" style="position:relative">
                    <label class="layui-form-label">填充透明度</label>
                    <div class="layui-input-block" style="position: absolute;top: 16px">
                        <div id="opacity-ellipsoid-fill" class="demo-slider"></div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">是否显示边框</label>
                    <div class="layui-input-block">
                        <input type="checkbox" lay-skin="switch" id="showEllipsoidOutline"
                            lay-filter="showEllipsoidOutline" title="开关">
                    </div>
                </div>
                <div class="layui-form-item outline color">
                    <label class="layui-form-label">边框色</label>
                    <div class="layui-input-block">
                        <div id="colorchk-ellipsoid-outline" style="display: inline-block;margin-top: 2px;"></div>
                    </div>
                </div>
                <div class="layui-form-item outline" style="position:relative;">
                    <label class="layui-form-label">边框透明度</label>
                    <div class="layui-input-block" style="position: absolute;top: 16px">
                        <div id="opacity-ellipsoid-outline" class="demo-slider"></div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">最小可视距离</label>
                    <div class="layui-input-block">
                        <input type="number" name="minViewDistance" lay-verify="title" autocomplete="off"
                            placeholder="0" onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item" style="border: 1px #fff solid">
                    <label class="layui-form-label">最大可视距离</label>
                    <div class="layui-input-block">
                        <input type="number" name="maxViewDistance" lay-verify="title" autocomplete="off"
                            placeholder="0" onkeyup="value=value.replace(/[^\d\.]/g,'')" class="layui-input">
                    </div>
                </div>
            </form>
        </div>
    </div>
    <script src="../layui/layui.js"></script>
    <script src="../jquery-2.0.3.js"></script>
    <script>
        var Viewer = parent.sgworld._Viewer;
        var Cesium = parent.Cesium;
        var PopupData = parent.SmartEarthPopupData;
        var type = PopupData.propType;
        var editGraphic = PopupData.editGraphic;
        var typeface="Sans-serif";
        var fontsize="24";

        !editGraphic && (editGraphic = {});

        //多边体
        if (type === 'polygon' && editGraphic.getValue('extrudedHeight')) {
            type = 'ExtrudedPolygon';
        }
        //圆锥体
        if (type === 'cylinder' && !editGraphic.entity.changeTop) {
            $('.cylinder input[name="topRadius"]').val(editGraphic.getValue('topRadius').toFixed(2));
            $('.cylinder .topRadius').show();
            $('.cylinder .cylinderType').html('圆锥体');
        }
        $('#Attribute').find("." + type).show();

        layui.use(['element', 'form', 'slider', 'colorpicker'], function () {
            window.element = layui.element; //Tab的切换功能，切换事件监听等，需要依赖element模块
            window.form = layui.form;
            window.slider = layui.slider;
            window.colorpicker = layui.colorpicker;

            // $('.props input[name="name"]').val(editGraphic.getValue('name'));

            let distanceDisplayCondition = editGraphic.getValue('distanceDisplayCondition');
            $('.props input[name="minViewDistance"]').val(distanceDisplayCondition.near);
            $('.props input[name="minViewDistance"]').on('input propertychange', function (event) {
                var value = $(this).val();
                distanceDisplayCondition.near = value;
                if (editGraphic.setValue) {
                    editGraphic.setValue('distanceDisplayCondition', distanceDisplayCondition);
                }
            });

            $('.props input[name="maxViewDistance"]').val(distanceDisplayCondition.far);
            $('.props input[name="maxViewDistance"]').on('input propertychange', function (event) {
                var value = $(this).val();
                distanceDisplayCondition.far = value;
                if (editGraphic.setValue) {
                    editGraphic.setValue('distanceDisplayCondition', distanceDisplayCondition);
                }
            });

            switch (type) {
                case 'point':
                    $('.point input[name="size"]').val(editGraphic.getValue('pixelSize'));
                    $('.point input[name="outlineWidth"]').val(editGraphic.getValue('outlineWidth'));
                    pointProp();
                    break;
                case 'billboard':
                    $('.billboard input[name="scale"]').val(editGraphic.getValue('scale'));
                    $('.billboard input[name="image"]').val(editGraphic.getValue('image'));
                    $('.billboard input[name="rotation"]').val(editGraphic.getValue('rotation'));
                    $('.billboard input[name="width"]').val(editGraphic.getValue('width'));
                    $('.billboard input[name="height"]').val(editGraphic.getValue('height'));
                    billboardProp();
                    break;
                case 'label':
                    $('.label input[name="scale"]').val(editGraphic.getValue('scale'));
                    $('.label input[name="text"]').val(editGraphic.getValue('text'));
                    $('.label input[name="font"]').val(editGraphic.getValue('font'));
                    var zt=editGraphic.getValue('font').split("px ");
                    $('.label input[name="fontsize"]').val(zt[0]);
                    $('.typeface').val(zt[1]);
                    $('.label input[name="outlineWidth"]').val(editGraphic.getValue('outlineWidth'));
                    labelProp();
                    break;
                case 'model':
                    $('.model input[name="height"]').val(editGraphic.getValue('pHeight').toFixed(2));
                    $('.model input[name="scale"]').val(editGraphic.getValue('scale'));
                    $('.model input[name="url"]').val(editGraphic.getValue('uri'));
                    $('.model input[name="minimumPixelSize"]').val(editGraphic.getValue('minimumPixelSize'));
                    $('.model input[name="heading"]').val(editGraphic.getValue('heading'));
                    $('.model input[name="pitch"]').val(editGraphic.getValue('pitch'));
                    $('.model input[name="roll"]').val(editGraphic.getValue('roll'));
                    modelProp();
                    break;
                case 'polyline':
                    polylineProp();
                    $('.polyline input[name="width"]').val(editGraphic.getValue('width'));
                    $('.polyline input[name="outlineWidth"]').val(editGraphic.getValue('material').outlineWidth);
                    break;
                case 'polygon':
                    polygonProp();
                    break;
                case 'rectangle':
                    $('.rectangle input[name="height"]').val(editGraphic.getValue('height') && editGraphic.getValue('height').toFixed(2));
                    $('.rectangle input[name="rotation"]').val(editGraphic.getValue('rotation'));
                    rectangleProp();
                    break;
                case 'ellipse':
                    $('.ellipse input[name="height"]').val(editGraphic.getValue('height') && editGraphic.getValue('height').toFixed(2));
                    $('.ellipse input[name="radius"]').val(editGraphic.getValue('radius') && editGraphic.getValue('radius').toFixed(2));
                    ellipseProp();
                    break;
                case 'box':
                    boxProp();
                    let dimensions = editGraphic.getValue('dimensions');
                    $('.box input[name="long"]').val(dimensions.x.toFixed(2));
                    $('.box input[name="width"]').val(dimensions.y.toFixed(2));
                    $('.box input[name="height"]').val(dimensions.z.toFixed(2));
                    break;
                case 'cylinder':
                    cylinderProp();
                    $('.cylinder input[name="radius"]').val(editGraphic.getValue('radius').toFixed(2));
                    $('.cylinder input[name="height"]').val(editGraphic.getValue('length').toFixed(2));
                    break;
                case 'ellipsoid':
                    ellipsoidProp();
                    $('.ellipsoid input[name="radius"]').val(editGraphic.getValue('radius').toFixed(2));
                    break;
                case 'ExtrudedPolygon':
                    ExtrudedPolygonProp();
                    $('.ExtrudedPolygon input[name="height"]').val(editGraphic.getValue('height').toFixed(2));
                    $('.ExtrudedPolygon input[name="extrudedHeight"]').val((editGraphic.getValue('extrudedHeight') - editGraphic.getValue('height')).toFixed(2));
                    break;
            }
        });

        //基本点属性
        function pointProp() {
            //大小
            $('.point input[name="size"]').on('input propertychange', function (event) {
                var value = $(this).val().replace(/[^\d\.]/g, '');
                if (value === '' || value === '.') return;
                if (editGraphic.setValue) {
                    editGraphic.setValue('pixelSize', parseFloat(value));
                }
            });
            //边框宽
            $('.props input[name="outlineWidth"]').on('input propertychange', function (event) {
                var value = $(this).val().replace(/[^\d\.]/g, '');
                if (value === '' || value === '.') return;
                if (editGraphic.setValue) {
                    editGraphic.setValue('outlineWidth', parseFloat(value));
                }
            });

            //填充色透明度
            slider.render({
                elem: '#opacity-point-fill'
                , min: 0 //最小值
                , max: 100 //最大值
                , value: 100-editGraphic.alpha
                , change: function (value) {
                    var transparency=100-value;
                    editGraphic.alpha = transparency;
                    editGraphic.setValue('alpha', transparency / 100);
                }
            });

            //边框透明度
            slider.render({
                elem: '#opacity-point-outline'
                , min: 0 //最小值
                , max: 100 //最大值
                , value: 100-editGraphic.outlineAlpha
                , change: function (value) {
                    var transparency=100-value;
                    editGraphic.outlineAlpha = transparency;
                    editGraphic.setValue('outlineAlpha', transparency / 100);
                }
            });

            //填充色
            colorpicker.render({
                elem: '#colorchk-point-fill'
                , color: editGraphic.fillColor   //设置默认色
                , done: function (color) {
                    editGraphic.fillColor = color;
                    editGraphic.graphic.color.setValue(new Cesium.Color.fromCssColorString(editGraphic.fillColor).withAlpha(editGraphic.alpha / 100));
                }
            });

            //边框色
            colorpicker.render({
                elem: '#colorchk-point-outline'
                , color: editGraphic.outlineColor   //设置默认色
                , done: function (color) {
                    editGraphic.outlineColor = color;
                    editGraphic.graphic.outlineColor.setValue(new Cesium.Color.fromCssColorString(editGraphic.outlineColor).withAlpha(editGraphic.outlineAlpha / 100));
                }
            });

            //是否显示边框
            form.on('switch(showPointOutline)', function (data) {
                var isShow = this.checked;
                if (isShow) {
                    $("#isBanBorder_basicPoint").removeAttr("readonly")
                    let value = $('.point input[name="outlineWidth"]').val();
                    value = parseFloat(value);
                    value == 0 && (value = 1, $('.point input[name="outlineWidth"]').val(1));
                    editGraphic.setValue('outlineWidth', value);
                } else {
                    $("#isBanBorder_basicPoint").attr("readonly", "readonly")
                    editGraphic.setValue('outlineWidth', 0);
                }
            });
            if (editGraphic.getValue('outlineWidth') != 0) {
                $('#showPointOutline').next().click();
                $('#showPointOutline').attr('value', 'on')
            }
            //是否显示边框
            form.on('switch(isPointDisableDepthTest)', function (data) {
                var isShow = this.checked;
                if (isShow) {
                    editGraphic.setValue('disableDepthTestDistance', Number.POSITIVE_INFINITY);
                } else {
                    editGraphic.setValue('disableDepthTestDistance', undefined);
                }
            });
            if (editGraphic.getValue('disableDepthTestDistance') === Number.POSITIVE_INFINITY) {
                $('#isPointDisableDepthTest').next().click();
                $('#isPointDisableDepthTest').attr('value', 'on')
            }
        }

        //图片点属性
        function billboardProp() {
            //图片
            $('.billboard input[name="image"]').on('blur', function (event) {
                var value = $(this).val();
                if (value === '') return;
                if (editGraphic.setValue) {
                    editGraphic.setValue('image', value);
                }
            });
            //大小
            $('.billboard input[name="scale"]').on('input propertychange', function (event) {
                var value = $(this).val().replace(/[^\d\.]/g, '');
                if (value === '' || value === '.') return;
                if (editGraphic.setValue) {
                    editGraphic.setValue('scale', parseFloat(value));
                }
            });

            //旋转
            $('.billboard input[name="rotation"]').on('input propertychange', function (event) {
                var value = $(this).val().replace(/[^\d\.\-]/g, '');
                if (value === '.') return;
                if (value === '') value = undefined;
                if (editGraphic.setValue) {
                    editGraphic.setValue('rotation', -parseFloat(value) * Math.PI / 180);
                }
            });

            //宽
            $('.billboard input[name="width"]').on('input propertychange', function (event) {
                var value = $(this).val().replace(/[^\d\.]/g, '');
                if (value === '' || value === '.') return;
                if (editGraphic.setValue) {
                    editGraphic.setValue('width', parseFloat(value));
                }
            });

            //高
            $('.billboard input[name="height"]').on('input propertychange', function (event) {
                var value = $(this).val().replace(/[^\d\.]/g, '');
                if (value === '' || value === '.') return;
                if (editGraphic.setValue) {
                    editGraphic.setValue('height', parseFloat(value));
                }
            });

            let horizontalOrigin = editGraphic.getValue('horizontalOrigin');
            $(`.billboard .horizontalOrigin option[value="${horizontalOrigin}"]`).attr('selected', true);

            //水平对齐
            form.on('select(horizontalOrigin)', function (data) {
                var value = parseInt(data.value);
                if (editGraphic.setValue) {
                    editGraphic.setValue('horizontalOrigin', value);
                }
            });

            let verticalOrigin = editGraphic.getValue('verticalOrigin');
            $(`.billboard .verticalOrigin option[value="${verticalOrigin}"]`).attr('selected', true);
            form.render('select');

            //垂直对齐
            form.on('select(verticalOrigin)', function (data) {
                var value = parseInt(data.value);
                if (editGraphic.setValue) {
                    editGraphic.setValue('verticalOrigin', value);
                }
            });

            //填充色透明度
            slider.render({
                elem: '#opacity-billboard-fill'
                , min: 0 //最小值
                , max: 100 //最大值
                , value: 100-editGraphic.alpha
                , change: function (value) {
                    var transparency=100-value;
                    editGraphic.alpha = transparency;
                    editGraphic.setValue('alpha', transparency / 100);
                }
            });

            //填充色
            colorpicker.render({
                elem: '#colorchk-billboard-fill'
                , color: editGraphic.fillColor   //设置默认色
                , done: function (color) {
                    editGraphic.fillColor = color;
                    editGraphic.graphic.color.setValue(new Cesium.Color.fromCssColorString(editGraphic.fillColor).withAlpha(editGraphic.alpha / 100));
                }
            });

            //是否不被遮挡
            form.on('switch(isBillboardDisableDepthTest)', function (data) {
                var isShow = this.checked;
                if (isShow) {
                    editGraphic.setValue('disableDepthTestDistance', Number.POSITIVE_INFINITY);
                } else {
                    editGraphic.setValue('disableDepthTestDistance', undefined);
                }
            });
            if (editGraphic.getValue('disableDepthTestDistance') === Number.POSITIVE_INFINITY) {
                $('#isBillboardDisableDepthTest').next().click();
                $('#isBillboardDisableDepthTest').attr('value', 'on')
            }
        }

        //文本点属性
        function labelProp() {
            //字体
            $('.label input[name="font"]').on('blur', function (event) {
                var value = $(this).val();
                if (value === '') return;
                if (editGraphic.setValue) {
                    editGraphic.setValue('font', value);
                }
            });
             //字体大小xp
            $('.label input[name="fontsize"]').on('blur', function (event) {
                var value = $(this).val();
                fontsize=value;
                var zt=editGraphic.getValue('font').split("px ");
                value=value+"px "+zt[1];
                if (value === '') return;
                if (editGraphic.setValue) {
                    editGraphic.setValue('font', value);
                }
            });
            //字体xp
            form.on('select(typeface)', function (data) {
                var zt=editGraphic.getValue('font').split("px ");
                var value = zt[0]+"px "+data.value;
                typeface=data.value;
                if (editGraphic.setValue) {
                    editGraphic.setValue('font', value);
                }
            });
            //内容
            $('.label input[name="text"]').on('input propertychange', function (event) {
                var value = $(this).val();
                if (editGraphic.setValue) {
                    editGraphic.setValue('text', value);
                }
            });

            //比例
            $('.label input[name="scale"]').on('input propertychange', function (event) {
                var value = $(this).val().replace(/[^\d\.]/g, '');
                if (value === '' || value === '.') return;
                if (editGraphic.setValue) {
                    editGraphic.setValue('scale', parseFloat(value));
                }
            });
            //边框宽
            $('.label input[name="outlineWidth"]').on('input propertychange', function (event) {
                var value = $(this).val().replace(/[^\d\.]/g, '');
                if (value === '' || value === '.') return;
                if (editGraphic.setValue) {
                    editGraphic.setValue('outlineWidth', parseFloat(value));
                }
            });

            let horizontalOrigin = editGraphic.getValue('horizontalOrigin');
            $(`.label .horizontalOrigin option[value="${horizontalOrigin}"]`).attr('selected', true);

            //水平对齐
            form.on('select(horizontalOrigin)', function (data) {
                var value = parseInt(data.value);
                if (editGraphic.setValue) {
                    editGraphic.setValue('horizontalOrigin', value);
                }
            });

            let verticalOrigin = editGraphic.getValue('verticalOrigin');
            $(`.label .verticalOrigin option[value="${verticalOrigin}"]`).attr('selected', true);
            form.render('select');

            //垂直对齐
            form.on('select(verticalOrigin)', function (data) {
                var value = parseInt(data.value);
                if (editGraphic.setValue) {
                    editGraphic.setValue('verticalOrigin', value);
                }
            });

            //填充色透明度
            slider.render({
                elem: '#opacity-label-fill'
                , min: 0 //最小值
                , max: 100 //最大值
                , value: 100-editGraphic.alpha
                , change: function (value) {
                    var transparency=100-value;
                    editGraphic.alpha = transparency;
                    editGraphic.setValue('alpha', transparency / 100);
                }
            });

            //边框透明度
            slider.render({
                elem: '#opacity-label-outline'
                , min: 0 //最小值
                , max: 100 //最大值
                , value: 100-editGraphic.outlineAlpha
                , change: function (value) {
                    var transparency=100-value;
                    editGraphic.outlineAlpha = transparency;
                    editGraphic.setValue('outlineAlpha', transparency / 100);
                }
            });

            //背景透明度
            slider.render({
                elem: '#opacity-label-background'
                , min: 0 //最小值
                , max: 100 //最大值
                , value: 100-editGraphic.backgroundAlpha
                , change: function (value) {
                    var transparency=100-value;
                    editGraphic.backgroundAlpha = transparency;
                    editGraphic.setValue('backgroundAlpha', transparency / 100);
                }
            });

            //填充色
            colorpicker.render({
                elem: '#colorchk-label-fill'
                , color: editGraphic.fillColor   //设置默认色
                , done: function (color) {
                    editGraphic.fillColor = color;
                    editGraphic.graphic.fillColor.setValue(new Cesium.Color.fromCssColorString(editGraphic.fillColor).withAlpha(editGraphic.alpha / 100));
                }
            });

            //边框色
            colorpicker.render({
                elem: '#colorchk-label-outline'
                , color: editGraphic.outlineColor   //设置默认色
                , done: function (color) {
                    editGraphic.outlineColor = color;
                    editGraphic.graphic.outlineColor.setValue(new Cesium.Color.fromCssColorString(editGraphic.outlineColor).withAlpha(editGraphic.outlineAlpha / 100));
                }
            });
            //背景色
            colorpicker.render({
                elem: '#colorchk-label-background'
                , color: editGraphic.backgroundColor   //设置默认色
                , done: function (color) {
                    editGraphic.backgroundColor = color;
                    editGraphic.graphic.backgroundColor.setValue(new Cesium.Color.fromCssColorString(editGraphic.backgroundColor).withAlpha(editGraphic.backgroundAlpha / 100));
                }
            });

            //是否显示边框
            form.on('switch(showLabelOutline)', function (data) {
                var isShow = this.checked;
                if (isShow) {
                    $("#isBanBorder_labelOurline").removeAttr("readonly")
                    let value = $('.label input[name="outlineWidth"]').val();
                    value = parseFloat(value);
                    value == 0 && (value = 1, $('.label input[name="outlineWidth"]').val(1));
                    editGraphic.setValue('outlineWidth', value);
                } else {
                    $("#isBanBorder_labelOurline").attr("readonly", "readonly")
                    editGraphic.setValue('outlineWidth', 0);
                }
            });
            if (editGraphic.getValue('outlineWidth') != 0) {
                $('#showLabelOutline').next().click();
                $('#showLabelOutline').attr('value', 'on')
            }

            //是否显示背景
            form.on('switch(showLabelBackground)', function (data) {
                var isShow = this.checked;
                if (isShow) {
                    $('.background').show();
                } else {
                    $('.background').hide();
                }
                editGraphic.setValue('showBackground', isShow);
            });
            if (editGraphic.getValue('showBackground')) {
                $('#showLabelBackground').next().click();
                $('#showLabelBackground').attr('value', 'on')
            }

            //是否不被遮挡
            form.on('switch(isLabelDisableDepthTest)', function (data) {
                var isShow = this.checked;
                if (isShow) {
                    editGraphic.setValue('disableDepthTestDistance', Number.POSITIVE_INFINITY);
                } else {
                    editGraphic.setValue('disableDepthTestDistance', undefined);
                }
            });
            if (editGraphic.getValue('disableDepthTestDistance') === Number.POSITIVE_INFINITY) {
                $('#isLabelDisableDepthTest').next().click();
                $('#isLabelDisableDepthTest').attr('value', 'on')
            }
        }

        //模型点属性
        function modelProp() {
            //模型链接
            $('.model input[name="url"]').on('blur', function (event) {
                var value = $(this).val();
                if (value === '') return;
                if (editGraphic.setValue) {
                    editGraphic.setValue('uri', value);
                }
            });

            //高度
            $('.model input[name="height"]').on('input propertychange', function (event) {
                var value = $(this).val().replace(/[^\d\.\-]/g, '');
                if (value === '' || value === '.') return;
                if (editGraphic.setValue) {
                    editGraphic.setValue('pHeight', parseFloat(value));
                }
            });

            //比例
            $('.model input[name="scale"]').on('input propertychange', function (event) {
                var value = $(this).val().replace(/[^\d\.]/g, '');
                if (value === '' || value === '.') return;
                if (editGraphic.setValue) {
                    editGraphic.setValue('scale', parseFloat(value));
                }
            });

            //最小显示尺寸
            $('.model input[name="minimumPixelSize"]').on('input propertychange', function (event) {
                var value = $(this).val().replace(/[^\d\.]/g, '');
                if (value === '' || value === '.') return;
                if (editGraphic.setValue) {
                    editGraphic.setValue('minimumPixelSize', parseFloat(value));
                }
            });

            //方向
            $('.model input[name="heading"]').on('input propertychange', function (event) {
                var value = $(this).val().replace(/[^\d\.\-]/g, '');
                if (value === '' || value === '.') return;
                if (editGraphic.setValue) {
                    editGraphic.setValue('heading', parseFloat(value));
                }
            });

            //俯仰
            $('.model input[name="pitch"]').on('input propertychange', function (event) {
                var value = $(this).val().replace(/[^\d\.\-]/g, '');
                if (value === '' || value === '.') return;
                if (editGraphic.setValue) {
                    editGraphic.setValue('pitch', parseFloat(value));
                }
            });

            //翻滚
            $('.model input[name="roll"]').on('input propertychange', function (event) {
                var value = $(this).val().replace(/[^\d\.\-]/g, '');
                if (value === '' || value === '.') return;
                if (editGraphic.setValue) {
                    editGraphic.setValue('roll', parseFloat(value));
                }
            });

            //填充色透明度
            slider.render({
                elem: '#opacity-model-fill'
                , min: 0 //最小值
                , max: 100 //最大值
                , value: 100-editGraphic.alpha
                , change: function (value) {
                    var transparency=100-value;
                    editGraphic.alpha = transparency;
                    editGraphic.setValue('alpha', transparency / 100);
                }
            });

            //填充色
            colorpicker.render({
                elem: '#colorchk-model-fill'
                , color: editGraphic.fillColor   //设置默认色
                , done: function (color) {
                    editGraphic.fillColor = color;
                    editGraphic.graphic.color.setValue(new Cesium.Color.fromCssColorString(editGraphic.fillColor).withAlpha(editGraphic.alpha / 100));
                }
            });

            //是否执行动画
            form.on('switch(runAnimations)', function (data) {
                var isShow = this.checked;
                editGraphic.setValue('runAnimations', isShow);
            });
            if (editGraphic.getValue('runAnimations')) {
                $('#runAnimations').next().click();
                $('#runAnimations').attr('value', 'on')
            }

            //是否自旋转
            form.on('switch(autoRotate)', function (data) {
                var isShow = this.checked;
                if (isShow) {
                    if (!editGraphic.entity.autoRotate) {
                        editGraphic.setValue('autoRotate', 2);
                    }
                } else {
                    editGraphic.setValue('autoRotate', false);
                }
                editGraphic.entity.autoRotate = isShow;
            });
            if (editGraphic.entity.autoRotate) {
                $('#autoRotate').next().click();
                $('#autoRotate').attr('value', 'on')
            }
        }

        //拉伸面属性
        function ExtrudedPolygonProp() {
            $('.ExtrudedPolygon input[name="height"]').on('input propertychange', function (event) {
                var value = $(this).val().replace(/[^\d\.]/g, '');
                if (value === '' || value === '.') return;
                if (editGraphic.setValue) {
                    editGraphic.setValue('height', parseFloat(value));

                    let extrudedHeight = $('.ExtrudedPolygon input[name="extrudedHeight"]').val();
                    editGraphic.setValue('extrudedHeight', parseFloat(extrudedHeight) + parseFloat(value));
                }
            });
            $('.ExtrudedPolygon input[name="extrudedHeight"]').on('input propertychange', function (event) {
                var value = $(this).val().replace(/[^\d\.]/g, '');
                if (value === '' || value === '.') return;
                if (editGraphic.setValue) {
                    editGraphic.setValue('extrudedHeight', parseFloat(value) + editGraphic.getValue('height'));
                }
            });

            //填充色透明度
            slider.render({
                elem: '#opacity-ExtrudedPolygon-fill'
                , min: 0 //最小值
                , max: 100 //最大值
                , value: 100-editGraphic.alpha
                , change: function (value) {
                    var transparency=100-value;
                    editGraphic.alpha = transparency;
                    editGraphic.setValue('alpha', transparency / 100);
                }
            });

            //边框透明度
            slider.render({
                elem: '#opacity-ExtrudedPolygon-outline'
                , min: 0 //最小值
                , max: 100 //最大值
                , value: 100-editGraphic.outlineAlpha
                , change: function (value) {
                    var transparency=100-value;
                    editGraphic.outlineAlpha = transparency;
                    editGraphic.setValue('outlineAlpha', transparency / 100);
                }
            });

            //填充色
            colorpicker.render({
                elem: '#colorchk-ExtrudedPolygon-fill'
                , color: editGraphic.fillColor   //设置默认色
                , done: function (color) {
                    editGraphic.fillColor = color;
                    editGraphic.graphic.material.color.setValue(new Cesium.Color.fromCssColorString(editGraphic.fillColor).withAlpha(editGraphic.alpha / 100));
                }
            });

            //边框色
            colorpicker.render({
                elem: '#colorchk-ExtrudedPolygon-outline'
                , color: editGraphic.outlineColor   //设置默认色
                , done: function (color) {
                    editGraphic.outlineColor = color;
                    editGraphic.graphic.outlineColor.setValue(new Cesium.Color.fromCssColorString(editGraphic.outlineColor).withAlpha(editGraphic.outlineAlpha / 100));
                }
            });

            //是否显示边框
            form.on('switch(showExtrudedPolygonOutline)', function (data) {
                let isShow = this.checked;
                editGraphic.setValue('outline', isShow);
            });
            if (editGraphic.getValue('outline')) {
                $('#showExtrudedPolygonOutline').next().click();
                $('#showExtrudedPolygonOutline').attr('value', 'on')
            }
        }

        //多边形属性
        function polygonProp() {
            //填充色透明度
            slider.render({
                elem: '#opacity-polygon-fill'
                , min: 0 //最小值
                , max: 100 //最大值
                , value: 100-editGraphic.alpha
                , change: function (value) {
                    var transparency=100-value;
                    editGraphic.alpha = transparency;
                    editGraphic.setValue('alpha', transparency / 100);
                }
            });

            //边框透明度
            slider.render({
                elem: '#opacity-polygon-outline'
                , min: 0 //最小值
                , max: 100 //最大值
                , value: 100-editGraphic.outlineAlpha
                , change: function (value) {
                    var transparency=100-value;
                    editGraphic.outlineAlpha = transparency;
                    editGraphic.setValue('outlineAlpha', transparency / 100);
                }
            });

            //填充色
            colorpicker.render({
                elem: '#colorchk-polygon-fill'
                , color: editGraphic.fillColor   //设置默认色
                , done: function (color) {
                    editGraphic.fillColor = color;
                    editGraphic.graphic.material.color.setValue(new Cesium.Color.fromCssColorString(editGraphic.fillColor).withAlpha(editGraphic.alpha / 100));
                }
            });

            //边框色
            colorpicker.render({
                elem: '#colorchk-polygon-outline'
                , color: editGraphic.outlineColor   //设置默认色
                , done: function (color) {
                    editGraphic.outlineColor = color;
                    editGraphic.graphic.outlineColor.setValue(new Cesium.Color.fromCssColorString(editGraphic.outlineColor).withAlpha(editGraphic.outlineAlpha / 100));
                }
            });

            //是否显示边框
            form.on('switch(showPolygonOutline)', function (data) {
                let isShow = this.checked;

                editGraphic.setValue('outline', isShow);
            });
            if (editGraphic.getValue('outline')) {
                $('#showPolygonOutline').next().click();
                $('#showPolygonOutline').attr('value', 'on')
            }

            //是否贴地
            form.on('switch(showClampToGround)', function (data) {
                editGraphic.setValue('clampToGround', this.checked);
            });
            if (editGraphic.getValue('heightReference') === Cesium.HeightReference.CLAMP_TO_GROUND) {
                $('#showClampToGround_Polygon').next().click();
                $('#showClampToGround_Polygon').attr('value', 'on')
            }
        }

        //矩形属性
        function rectangleProp() {
            //旋转
            $('.rectangle input[name="rotation"]').on('input propertychange', function (event) {
                var value = $(this).val().replace(/[^\d\.\-]/g, '');
                if (value === '' || value === '.') return;
                if (editGraphic.setValue) {
                    editGraphic.setValue('rotation', -parseFloat(value) * Math.PI / 180);
                }
            });

            //高度
            $('.rectangle input[name="height"]').on('input propertychange', function (event) {
                var value = $(this).val().replace(/[^\d\.\-]/g, '');
                if (value === '' || value === '.') return;
                if (editGraphic.setValue) {
                    editGraphic.setValue('height', parseFloat(value));
                }
            });

            //填充色透明度
            slider.render({
                elem: '#opacity-rectangle-fill'
                , min: 0 //最小值
                , max: 100 //最大值
                , value: 100-editGraphic.alpha
                , change: function (value) {
                    var transparency=100-value;
                    editGraphic.alpha = transparency;
                    editGraphic.setValue('alpha', transparency / 100);
                }
            });

            //边框透明度
            slider.render({
                elem: '#opacity-rectangle-outline'
                , min: 0 //最小值
                , max: 100 //最大值
                , value: 100-editGraphic.outlineAlpha
                , change: function (value) {
                    var transparency=100-value;
                    editGraphic.outlineAlpha = transparency;
                    editGraphic.setValue('outlineAlpha', transparency / 100);
                }
            });

            //填充色
            colorpicker.render({
                elem: '#colorchk-rectangle-fill'
                , color: editGraphic.fillColor   //设置默认色
                , done: function (color) {
                    editGraphic.fillColor = color;
                    editGraphic.graphic.material.color.setValue(new Cesium.Color.fromCssColorString(editGraphic.fillColor).withAlpha(editGraphic.alpha / 100));
                }
            });

            //边框色
            colorpicker.render({
                elem: '#colorchk-rectangle-outline'
                , color: editGraphic.outlineColor   //设置默认色
                , done: function (color) {
                    editGraphic.outlineColor = color;
                    editGraphic.graphic.outlineColor.setValue(new Cesium.Color.fromCssColorString(editGraphic.outlineColor).withAlpha(editGraphic.outlineAlpha / 100));
                }
            });

            //是否显示边框
            form.on('switch(showRectangleOutline)', function (data) {
                let isShow = this.checked;
                editGraphic.setValue('outline', isShow);
            });
            if (editGraphic.getValue('outline')) {
                $('#showRectangleOutline').next().click();
                $('#showRectangleOutline').attr('value', 'on')
            }

            let isRenderCheck;
            //是否贴地
            form.on('switch(showClampToGround)', function (data) {
                if (isRenderCheck) {
                    isRenderCheck = false;
                    return;
                }
                editGraphic.setValue('clampToGround', this.checked);
                editGraphic.getValue('height') && $('.rectangle input[name="height"]').val(editGraphic.getValue('height'))
                this.checked ? $('.rectangle .height').hide() : $('.rectangle .height').show();
            });
            if (editGraphic.getValue('heightReference') === Cesium.HeightReference.CLAMP_TO_GROUND) {
                isRenderCheck = true;
                $('#showClampToGround_Rectangle').next().click();
                $('#showClampToGround_Rectangle').attr('value', 'on');
                $('.rectangle .height').hide();
            }
        }

        //圆形属性
        function ellipseProp() {
            //高度
            $('.ellipse input[name="height"]').on('input propertychange', function (event) {
                var value = $(this).val().replace(/[^\d\.\-]/g, '');
                if (value === '' || value === '.') return;
                if (editGraphic.setValue) {
                    editGraphic.setValue('height', parseFloat(value));
                }
            });

            //半径
            $('.ellipse input[name="radius"]').on('input propertychange', function (event) {
                var value = $(this).val().replace(/[^\d\.]/g, '');
                if (value === '' || value === '.') return;
                if (editGraphic.setValue) {
                    editGraphic.setValue('radius', parseFloat(value));
                }
            });

            //填充色透明度
            slider.render({
                elem: '#opacity-ellipse-fill'
                , min: 0 //最小值
                , max: 100 //最大值
                , value: 100-editGraphic.alpha
                , change: function (value) {
                    var transparency=100-value;
                    editGraphic.alpha = transparency;
                    editGraphic.setValue('alpha', transparency / 100);
                }
            });

            //边框透明度
            slider.render({
                elem: '#opacity-ellipse-outline'
                , min: 0 //最小值
                , max: 100 //最大值
                , value: 100-editGraphic.outlineAlpha
                , change: function (value) {
                    var transparency=100-value;
                    editGraphic.outlineAlpha = transparency;
                    editGraphic.setValue('outlineAlpha', transparency / 100);
                }
            });

            //填充色
            colorpicker.render({
                elem: '#colorchk-ellipse-fill'
                , color: editGraphic.fillColor   //设置默认色
                , done: function (color) {
                    editGraphic.fillColor = color;
                    editGraphic.graphic.material.color.setValue(new Cesium.Color.fromCssColorString(editGraphic.fillColor).withAlpha(editGraphic.alpha / 100));
                }
            });

            //边框色
            colorpicker.render({
                elem: '#colorchk-ellipse-outline'
                , color: editGraphic.outlineColor   //设置默认色
                , done: function (color) {
                    editGraphic.outlineColor = color;
                    editGraphic.graphic.outlineColor.setValue(new Cesium.Color.fromCssColorString(editGraphic.outlineColor).withAlpha(editGraphic.outlineAlpha / 100));
                }
            });

            //是否显示边框
            form.on('switch(showEllipseOutline)', function (data) {
                let isShow = this.checked;
                editGraphic.setValue('outline', isShow);
            });
            if (editGraphic.getValue('outline')) {
                $('#showEllipseOutline').next().click();
                $('#showEllipseOutline').attr('value', 'on')
            }

            let isRenderCheck;
            //是否贴地
            form.on('switch(showClampToGround)', function (data) {
                if (isRenderCheck) {
                    isRenderCheck = false;
                    return;
                }
                editGraphic.setValue('clampToGround', this.checked);
                editGraphic.getValue('height') && $('.ellipse input[name="height"]').val(editGraphic.getValue('height'))
                this.checked ? $('.ellipse .height').hide() : $('.ellipse .height').show();
            });
            if (editGraphic.getValue('heightReference') === Cesium.HeightReference.CLAMP_TO_GROUND) {
                isRenderCheck = true;
                $('.ellipse .height').hide();
                $('#showClampToGround_Ellipse').next().click();
                $('#showClampToGround_Ellipse').attr('value', 'on')
            }
        }

        //线属性
        function polylineProp() {
            //线宽
            $('.props input[name="width"]').on('input propertychange', function (event) {
                var value = $(this).val().replace(/[^\d\.]/g, '');
                if (value === '' || value === '.') return;
                if (editGraphic.setValue) {
                    editGraphic.setValue('width', parseFloat(value));
                }
            });

            //边框宽
            $('.props input[name="outlineWidth"]').on('input propertychange', function (event) {
                var value = $(this).val().replace(/[^\d\.]/g, '');
                if (value === '' || value === '.') return;
                if (editGraphic.setValue) {
                    editGraphic.setValue('outlineWidth', parseFloat(value));
                }
            });

            //填充色
            slider.render({
                elem: '#opacity-polyline-fill'
                , min: 0 //最小值
                , max: 100 //最大值
                , value: 100-editGraphic.alpha
                , change: function (value) {
                    var transparency=100-value;
                    editGraphic.alpha = transparency;
                    editGraphic.setValue('alpha', transparency / 100);
                }
            });

            //边框色
            slider.render({
                elem: '#opacity-polyline-outline'
                , min: 0 //最小值
                , max: 100 //最大值
                , value: 100-editGraphic.outlineAlpha
                , change: function (value) {
                    var transparency=100-value;
                    editGraphic.outlineAlpha = transparency;
                    editGraphic.setValue('outlineAlpha', transparency / 100);
                }
            });

            //填充色透明度
            colorpicker.render({
                elem: '#colorchk-polyline-fill'
                , color: editGraphic.fillColor //设置默认色
                , done: function (color) {
                    editGraphic.fillColor = color;
                    editGraphic.graphic.material.color.setValue(new Cesium.Color.fromCssColorString(editGraphic.fillColor).withAlpha(editGraphic.alpha / 100));
                }
            });

            //边框透明度
            colorpicker.render({
                elem: '#colorchk-polyline-outline'
                , color: editGraphic.outlineColor //设置默认色
                , done: function (color) {
                    editGraphic.outlineColor = color;
                    editGraphic.graphic.material.outlineColor.setValue(new Cesium.Color.fromCssColorString(editGraphic.outlineColor).withAlpha(editGraphic.outlineAlpha / 100));
                }
            });

            //是否显示边框
            form.on('switch(showPolylineOutline)', function (data) {
                var isShow = this.checked;
                if (isShow) {
                    $("#isBanBorder").removeAttr("readonly")
                    let value = $('.polyline input[name="outlineWidth"]').val();
                    value = parseFloat(value);
                    value == 0 && (value = 1, $('.polyline input[name="outlineWidth"]').val(1));
                    editGraphic.setValue('outlineWidth', value);
                } else {
                    $("#isBanBorder").attr("readonly", "readonly")
                    editGraphic.setValue('outlineWidth', 0);
                }
            });
            if (editGraphic.getValue('material') && editGraphic.getValue('material').outlineWidth != 0) {
                $('#showPolylineOutline').next().click();
                $('#showPolylineOutline').attr('value', 'on')
            }

            //是否贴地
            form.on('switch(showClampToGround)', function (data) {
                editGraphic.setValue('clampToGround', this.checked);
            });
            if (editGraphic.getValue('clampToGround')) {
                $('#showClampToGround_Polyline').next().click();
                $('#showClampToGround_Polyline').attr('value', 'on')
            }
        }

        //立方体属性
        function boxProp() {
            //长
            $('.box input[name="long"]').on('input propertychange', function (event) {
                var value = $(this).val().replace(/[^\d\.]/g, '');
                if (value === '' || value === '.') return;
                if (editGraphic.setValue) {
                    editGraphic.setValue('long', parseFloat(value));
                }
            });

            //宽
            $('.box input[name="width"]').on('input propertychange', function (event) {
                var value = $(this).val().replace(/[^\d\.]/g, '');
                if (value === '' || value === '.') return;
                if (editGraphic.setValue) {
                    editGraphic.setValue('width', parseFloat(value));
                }
            });

            //高
            $('.box input[name="height"]').on('input propertychange', function (event) {
                var value = $(this).val().replace(/[^\d\.]/g, '');
                if (value === '' || value === '.') return;
                if (editGraphic.setValue) {
                    editGraphic.setValue('height', parseFloat(value));
                }
            });

            //填充色透明度
            slider.render({
                elem: '#opacity-box-fill'
                , min: 0 //最小值
                , max: 100 //最大值
                , value: 100-editGraphic.alpha
                , change: function (value) {
                    var transparency=100-value;
                    editGraphic.alpha = transparency;
                    editGraphic.setValue('alpha', transparency / 100);
                }
            });

            //边框透明度
            slider.render({
                elem: '#opacity-box-outline'
                , min: 0 //最小值
                , max: 100 //最大值
                , value: 100-editGraphic.outlineAlpha
                , change: function (value) {
                    var transparency=100-value;
                    editGraphic.outlineAlpha = transparency;
                    editGraphic.setValue('outlineAlpha', transparency / 100);
                }
            });

            //填充色
            colorpicker.render({
                elem: '#colorchk-box-fill'
                , color: editGraphic.fillColor   //设置默认色
                , done: function (color) {
                    editGraphic.fillColor = color;
                    editGraphic.graphic.material.color.setValue(new Cesium.Color.fromCssColorString(editGraphic.fillColor).withAlpha(editGraphic.alpha / 100));
                }
            });

            //边框色
            colorpicker.render({
                elem: '#colorchk-box-outline'
                , color: editGraphic.outlineColor   //设置默认色
                , done: function (color) {
                    editGraphic.outlineColor = color;
                    editGraphic.graphic.outlineColor.setValue(new Cesium.Color.fromCssColorString(editGraphic.outlineColor).withAlpha(editGraphic.outlineAlpha / 100));
                }
            });

            //是否显示边框
            form.on('switch(showBoxOutline)', function (data) {
                let isShow = this.checked;
                editGraphic.setValue('outline', isShow);
            });
            if (editGraphic.getValue('outline')) {
                $('#showBoxOutline').next().click();
                $('#showBoxOutline').attr('value', 'on')
            }
        }

        //圆柱体属性
        function cylinderProp() {
            //半径
            $('.cylinder input[name="radius"]').on('input propertychange', function (event) {
                var value = $(this).val().replace(/[^\d\.]/g, '');
                if (value === '' || value === '.') return;
                if (editGraphic.setValue) {
                    editGraphic.setValue('radius', parseFloat(value));
                }
            });

            if (!editGraphic.entity.changeTop) {
                //顶部半径
                $('.cylinder input[name="topRadius"]').on('input propertychange', function (event) {
                    var value = $(this).val().replace(/[^\d\.]/g, '');
                    if (value === '' || value === '.') return;
                    if (editGraphic.setValue) {
                        editGraphic.setValue('topRadius', parseFloat(value));
                    }
                });
            }

            //高
            $('.cylinder input[name="height"]').on('input propertychange', function (event) {
                var value = $(this).val().replace(/[^\d\.]/g, '');
                if (value === '' || value === '.') return;
                if (editGraphic.setValue) {
                    editGraphic.setValue('length', parseFloat(value));
                }
            });

            //填充色透明度
            slider.render({
                elem: '#opacity-cylinder-fill'
                , min: 0 //最小值
                , max: 100 //最大值
                , value: 100-editGraphic.alpha
                , change: function (value) {
                    var transparency=100-value;
                    editGraphic.alpha = transparency;
                    editGraphic.setValue('alpha', transparency / 100);
                }
            });

            //边框透明度
            slider.render({
                elem: '#opacity-cylinder-outline'
                , min: 0 //最小值
                , max: 100 //最大值
                , value: 100-editGraphic.outlineAlpha
                , change: function (value) {
                    var transparency=100-value;
                    editGraphic.outlineAlpha = transparency;
                    editGraphic.setValue('outlineAlpha', transparency / 100);
                }
            });

            //填充色
            colorpicker.render({
                elem: '#colorchk-cylinder-fill'
                , color: editGraphic.fillColor   //设置默认色
                , done: function (color) {
                    editGraphic.fillColor = color;
                    editGraphic.graphic.material.color.setValue(new Cesium.Color.fromCssColorString(editGraphic.fillColor).withAlpha(editGraphic.alpha / 100));
                }
            });

            //边框色
            colorpicker.render({
                elem: '#colorchk-cylinder-outline'
                , color: editGraphic.outlineColor   //设置默认色
                , done: function (color) {
                    editGraphic.outlineColor = color;
                    editGraphic.graphic.outlineColor.setValue(new Cesium.Color.fromCssColorString(editGraphic.outlineColor).withAlpha(editGraphic.outlineAlpha / 100));
                }
            });

            //是否显示边框
            form.on('switch(showCylinderOutline)', function (data) {
                let isShow = this.checked;
                editGraphic.setValue('outline', isShow);
            });
            if (editGraphic.getValue('outline')) {
                $('#showCylinderOutline').next().click();
                $('#showCylinderOutline').attr('value', 'on')
            }
        }

        //球体属性
        function ellipsoidProp() {
            //半径
            $('.ellipsoid input[name="radius"]').on('input propertychange', function (event) {
                var value = $(this).val().replace(/[^\d\.]/g, '');
                if (value === '' || value === '.') return;
                if (editGraphic.setValue) {
                    editGraphic.setValue('radius', parseFloat(value));
                }
            });

            //填充色透明度
            slider.render({
                elem: '#opacity-ellipsoid-fill'
                , min: 0 //最小值
                , max: 100 //最大值
                , value: 100-editGraphic.alpha
                , change: function (value) {
                    var transparency=100-value;
                    editGraphic.alpha = transparency;
                    editGraphic.setValue('alpha', transparency / 100);
                }
            });

            //边框透明度
            slider.render({
                elem: '#opacity-ellipsoid-outline'
                , min: 0 //最小值
                , max: 100 //最大值
                , value: 100-editGraphic.outlineAlpha
                , change: function (value) {
                    var transparency=100-value;
                    editGraphic.outlineAlpha = transparency;
                    editGraphic.setValue('outlineAlpha', transparency / 100);
                }
            });

            //填充色
            colorpicker.render({
                elem: '#colorchk-ellipsoid-fill'
                , color: editGraphic.fillColor   //设置默认色
                , done: function (color) {
                    editGraphic.fillColor = color;
                    editGraphic.graphic.material.color.setValue(new Cesium.Color.fromCssColorString(editGraphic.fillColor).withAlpha(editGraphic.alpha / 100));
                }
            });

            //边框色
            colorpicker.render({
                elem: '#colorchk-ellipsoid-outline'
                , color: editGraphic.outlineColor   //设置默认色
                , done: function (color) {
                    editGraphic.outlineColor = color;
                    editGraphic.graphic.outlineColor.setValue(new Cesium.Color.fromCssColorString(editGraphic.outlineColor).withAlpha(editGraphic.outlineAlpha / 100));
                }
            });

            //是否显示边框
            form.on('switch(showEllipsoidOutline)', function (data) {
                let isShow = this.checked;

                editGraphic.setValue('outline', isShow);
            });
            if (editGraphic.getValue('outline')) {
                $('#showEllipsoidOutline').next().click();
                $('#showEllipsoidOutline').attr('value', 'on')
            }
        }

        function removeGraphic() {
            if (editGraphic.entity) {
                Viewer.entities.remove(editGraphic.entity);
            }
        }

        function getFillColor(rgba) {
            editGraphic.fillColor = colorHex('rgb(' + rgba.red * 255 + ',' + rgba.green * 255 + ',' + rgba.blue * 255 + ')');
            editGraphic.alpha = rgba.alpha * 100;
        }

        function getOutlineColor(rgba) {
            editGraphic.outlineColor = colorHex('rgb(' + rgba.red * 255 + ',' + rgba.green * 255 + ',' + rgba.blue * 255 + ')');
            editGraphic.outlineAlpha = rgba.alpha * 100;
        }

        function colorHex(rgb) {
            var _this = rgb;
            var reg = /^#([0-9a-fA-f]{3}|[0-9a-fA-f]{6})$/;
            if (/^(rgb|RGB)/.test(_this)) {
                var str = _this.replace(/(rgb|RGB)*/g, "");
                str = str.replace("(", "").replace(")", "");
                var aColor = str.split(",");
                var strHex = "#";
                for (var i = 0; i < aColor.length; i++) {
                    var hex = Number(aColor[i]).toString(16);
                    hex = hex.length === 1 ? 0 + '' + hex : hex;// 保证每个rgb的值为2位
                    if (hex === "0") {
                        hex += hex;
                    }
                    strHex += hex;
                }
                if (strHex.length !== 7) {
                    strHex = _this;
                }
                return strHex;
            } else if (reg.test(_this)) {
                var aNum = _this.replace(/#/, "").split("");
                if (aNum.length === 6) {
                    return _this;
                } else if (aNum.length === 3) {
                    var numHex = "#";
                    for (var i = 0; i < aNum.length; i += 1) {
                        numHex += (aNum[i] + aNum[i]);
                    }
                    return numHex;
                }
            } else {
                return _this;
            }
        }
    </script>


</body>

</html>